import 'package:flutter/material.dart';
import 'package:flutter_shop/tempData/tempdata.dart';
import 'package:provide/provide.dart';
import 'dart:convert';
import '../Model/categoryModel.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import '../tempData/tempdata.dart';
import 'package:fluttertoast/fluttertoast.dart';


class CategoryPage extends StatefulWidget {
  @override
  _CategoryPageState createState() => _CategoryPageState();
}

class _CategoryPageState extends State<CategoryPage> {

  @override
  void initState() {
//    _getCategory();
    super.initState();
  }
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('分类'),),
      body: Container(
        child: Row(
          children: <Widget>[
            LeftCategoryNav(),
            Column(
              children: <Widget>[
                RightCategoryNavState(),
                CategoryGoodsList()
              ],
            )
          ],
        ),
      ),

    );
  }
  void _getCategory() {
      print('开始获取分类的数据了');

//    CategoryListModel categoryModel = CategoryListModel.fromJson(CategoryListData);
//    print(categoryModel.message);

    var data = json.decode(CategoryListData.toString());
    CategoryListModel list = CategoryListModel.fromJson(data['data']);
    list.data.forEach((item){
      print(Utf8Encoder().convert(item.mallCategoryName));
//      print(utf8convert(item.mallCategoryName));
    });
  }
}
String utf8convert(String text) {
  List<int> bytes = text.toString().codeUnits;
  return utf8.decode(bytes);
}

//左侧分类导航
class LeftCategoryNav extends StatefulWidget {
  @override
  _LeftCategoryNavState createState() => _LeftCategoryNavState();
}

class _LeftCategoryNavState extends State<LeftCategoryNav> {
   List list = CategoryLeftList;
   var listIndex = 0;

  @override
  Widget build(BuildContext context) {
    return Container(
      width: ScreenUtil().setWidth(180),
      decoration: BoxDecoration(
        border: Border(
          right: BorderSide(width: 1,color: Colors.black12),
        )
      ),
      child: ListView.builder(
        itemCount: list.length,
        itemBuilder: (context,index){
          return _leftInkWell(index);
        },
      ),
    );
  }

  Widget _leftInkWell(int index){
    bool isClick = false;
    isClick = (index == listIndex)? true : false;
    return InkWell(
      onTap: (){
        Fluttertoast.showToast(
          msg: '这是一个提示框',
          gravity: ToastGravity.CENTER,
          toastLength: Toast.LENGTH_LONG,
          backgroundColor: Colors.black54,
          textColor: Colors.white,
          fontSize: 16
        );
        setState(() {
          listIndex = index;
        });
      },
      child: Container(
        height: ScreenUtil().setHeight(100),
        padding: EdgeInsets.only(left: 0,top: 20),
        decoration: BoxDecoration(
          color: isClick ? Color.fromRGBO(235, 235, 235, 1) : Colors.white,
          border: Border(
            bottom: BorderSide(width: 1,color: Colors.black12)
          )
        ),
        child: Text(list[index]),
      ),
    );
  }
}
//右侧顶部小类导航
class RightCategoryNavState extends StatefulWidget {
  @override
  _RightCategoryNavStateState createState() => _RightCategoryNavStateState();
}

class _RightCategoryNavStateState extends State<RightCategoryNavState> {

  List list = ['名酒','茅台','北京二锅头','舍得','天之蓝','海之蓝','梦之蓝'];
  @override
  Widget build(BuildContext context) {
    return Container(
      height: ScreenUtil().setHeight(60),
      width: ScreenUtil().setWidth(570),
      padding: EdgeInsets.only(top: 10),
      alignment: Alignment.center,
      decoration: BoxDecoration(
        color: Colors.white,
        border: Border(
          bottom: BorderSide(width: 1,color: Colors.black12)
        ),

      ),
      child: ListView.builder(
          scrollDirection: Axis.horizontal,
          itemCount: list.length,
          itemBuilder: (context,index){
            return _rightInkWell(list[index],0);
          }),
    );
  }

  Widget _rightInkWell(String item,int index){
    bool isClick =false;
//    isClick = (index == Provide.value(context)
    return InkWell(
      onTap: (){
        isClick = (index == 0)?true:false;
      },
      child: Container(
        padding: EdgeInsets.fromLTRB(5, 0, 5, 0),
        child: Text(item,
          style: TextStyle(fontSize: ScreenUtil().setSp(28),
            color: isClick?Colors.pink:Colors.black,
          ),
        ),
      ),
    );
  }
}
//数据列表展示
class CategoryGoodsList extends StatefulWidget {
  @override
  _CategoryGoodsListState createState() => _CategoryGoodsListState();
}

class _CategoryGoodsListState extends State<CategoryGoodsList> {

  List list = CategoodsList;
  @override
  Widget build(BuildContext context) {
    return  Expanded(
      child: Container(
            width: ScreenUtil().setWidth(570),
            height: ScreenUtil().setHeight(1000),
            child: ListView.builder(
                itemCount: list.length,
                itemBuilder: (context,index){
                  return _listWidget(index);
                }
            ),
          ),
      );

  }

  Widget _goodsImage(index){
    return Container(
      width: ScreenUtil().setWidth(200),
      height: ScreenUtil().setHeight(100),
      child: Image.network('${list[index]['image_url']}'),
    );
  }

  Widget _goodsName(index){
    return Container(
      padding: EdgeInsets.all(5),
      child: Text(list[index]['goodsName'],
        maxLines: 2,
        overflow: TextOverflow.ellipsis,
        style: TextStyle(fontSize: ScreenUtil().setSp(28)),
      ),
    );
  }
  Widget _goodsPrice(index){
    return Container(
      margin: EdgeInsets.only(top: 30),
      child: Row(
        children: <Widget>[
          Text('价格：￥${list[index]['newPrice']}',
            style: TextStyle(color: Colors.pink,fontSize: ScreenUtil().setSp(30)),

          ),
          Text('价格：￥${list[index]['price']}',
            style: TextStyle(color:  Colors.black26,
            decoration: TextDecoration.lineThrough),
          )
        ],
      ),
    );
  }

  Widget _listWidget(int index){
    return InkWell(
      onTap: (){},
      child: Container(
        padding:  EdgeInsets.only(top: 5,bottom: 5),
        decoration: BoxDecoration(
          color: Colors.white,
          border: Border(
            bottom: BorderSide(width: 1,color: Colors.black12)
          )
        ),
        child: Row(
          children: <Widget>[
            _goodsImage(index),
            Column(
              children: <Widget>[
                _goodsName(index),
                _goodsPrice(index)
              ],
            )
          ],
        ),
      ),
    );
  }
}

